<template>
	<view>
		<view style="background-color: #FF387B;display: flex;padding: 40upx 0 140upx 0;">
			<image style="width: 120upx;height: 120upx;border-radius: 80upx;margin: 0 30upx;" :src="user.userIcon"></image>
			<view style="flex: 1;height: 100upx;display: flex;flex-direction: column;justify-content: space-between;color: white;">
				<view style="font-size: 40upx;font-weight: bold;">{{user.nickName}}</view>
				<view>用户ID：{{user.userId}}</view>
			</view>
		</view>
		<view style="padding: 0 20upx;margin-top: -100upx;">
			<view style="padding: 0 20upx;border-radius: 15upx;background-color: white;">
				<view style="padding: 0 20upx;border-bottom: 1upx solid #EEEEEE;line-height: 70upx;">
					<text style="font-weight: bold;font-size: 26upx;">自提订单</text>
					<text @tap="toOrders(1,0)" style="float: right;font-size: 25upx;color: #A8A8A8;">全部订单 ></text>
				</view>
				<view style="display: flex;padding: 30upx 0;">
					<view @tap="toOrders(1,1)" style="flex-direction: column;flex: 1;display: flex;align-items: center;">
						<image style="width: 45upx;height: 45upx;" src="/static/obligation.png"></image>
						<text style="font-size: 25upx;">待付款</text>
					</view>
					<view @tap="toOrders(1,2)" style="flex-direction: column;flex: 1;display: flex;align-items: center;">
						<image style="width: 45upx;height: 45upx;" src="/static/send.png"></image>
						<text style="font-size: 25upx;">待发货</text>
					</view>
					<view @tap="toOrders(1,3)" style="flex-direction: column;flex: 1;display: flex;align-items: center;">
						<image style="width: 45upx;height: 45upx;" src="/static/receiving.png"></image>
						<text style="font-size: 25upx;">待收货</text>
					</view>
					<view @tap="toOrders(1,4)" style="flex-direction: column;flex: 1;display: flex;align-items: center;">
						<image style="width: 45upx;height: 45upx;" src="/static/received.png"></image>
						<text style="font-size: 25upx;">已收货</text>
					</view>
				</view>
			</view>
		</view>

		<view style="padding: 0 20upx;margin-top: 20upx;">
			<view style="padding: 0 20upx;border-radius: 15upx;background-color: white;">
				<view style="padding: 0 20upx;border-bottom: 1upx solid #EEEEEE;line-height: 70upx;">
					<text style="font-weight: bold;font-size: 26upx;">包邮订单</text>
					<text @tap="toOrders(2,0)" style="float: right;font-size: 25upx;color: #A8A8A8;">全部订单 ></text>
				</view>
				<view style="display: flex;padding: 30upx 0;">
					<view @tap="toOrders(2,1)" style="flex-direction: column;flex: 1;display: flex;align-items: center;">
						<image style="width: 45upx;height: 45upx;" src="/static/obligation01.png"></image>
						<text style="font-size: 25upx;">待付款</text>
					</view>
					<view @tap="toOrders(2,2)" style="flex-direction: column;flex: 1;display: flex;align-items: center;">
						<image style="width: 45upx;height: 45upx;" src="/static/send01.png"></image>
						<text style="font-size: 25upx;">待发货</text>
					</view>
					<view @tap="toOrders(2,3)" style="flex-direction: column;flex: 1;display: flex;align-items: center;">
						<image style="width: 45upx;height: 45upx;" src="/static/receiving01.png"></image>
						<text style="font-size: 25upx;">待收货</text>
					</view>
					<view @tap="toOrders(2,4)" style="flex-direction: column;flex: 1;display: flex;align-items: center;">
						<image style="width: 45upx;height: 45upx;" src="/static/received01.png"></image>
						<text style="font-size: 25upx;">已收货</text>
					</view>
				</view>
			</view>
		</view>

		<view style="padding: 0 20upx;margin-top: 20upx;">
			<view style="padding: 0 20upx;border-radius: 15upx;background-color: white;">
				<view style="padding: 0 20upx;border-bottom: 1upx solid #EEEEEE;line-height: 70upx;">
					<text style="font-weight: bold;font-size: 26upx;">我当前的自提点</text>
					<text style="float: right;font-size: 25upx;color: #A8A8A8;">设置默认自提点 ></text>
				</view>
				<view style="padding: 30upx 20upx;font-size: 28upx;">
					<view style="color: #FF387B;font-weight: bold;">{{current_team.teamName}}</view>
					<view style="display: flex;">
						<view style="font-size: 25upx;font-weight: bold;flex: 1;padding-right: 20upx;">
							<view>{{current_team.address}}</view>
							<text>自提点电话：{{current_team.mobile}}</text>
						</view>
						<view style="display: flex;align-items: center;">
							<view @tap="call" style="width: 120upx;font-size: 25upx;line-height: 50upx;color: white;background-color: #FF387B;text-align: center;border-radius: 30upx;">拨打</view>
						</view>
					</view>
				</view>
				<view style="padding: 0 20upx;border-bottom: 1upx solid #EEEEEE;line-height: 70upx;border-top: 1upx solid #EEEEEE;">
					<text style="font-size: 25upx;color: #A8A8A8;">商品问题请联系自提点，100%售后保障</text>
				</view>
			</view>
		</view>
		<view style="padding: 0 20upx;margin: 20upx 0;">
			<view style="padding: 0 20upx;border-radius: 15upx;background-color: white;">
				<view style="padding: 0 20upx;border-bottom: 1upx solid #EEEEEE;line-height: 70upx;">
					<text style="font-weight: bold;font-size: 26upx;;">我的服务</text>
				</view>
				<view style="padding-top: 20upx;overflow:hidden;zoom:1;">
					<view @tap="toService(i)" v-for="(item,i) in services" :key='i' style="flex-direction: column;flex: 1;display: flex;align-items: center;float: left;width: 167.5upx;margin-bottom: 20upx;">
						<image style="width: 45upx;height: 45upx;" src="/static/tabbar/cart01.png"></image>
						<text style="font-size: 25upx;">{{item}}</text>
					</view>
				</view>
			</view>
		</view>
		<chun-lei-modal type="login" :value="modalShow" @cancel="modalShow = false" @onConfirm="toLogin"></chun-lei-modal>
	</view>
</template>

<script>
	import chunLeiModal from '@/components/chunLei-modal/chunLei-modal.vue'
	export default {
		components: {
			chunLeiModal
		},
		data() {
			return {
				user: null,
				modalShow: false,
				current_team: null,
				services:[
					'优惠券','收货地址','资质规则','历史订单','推广码','送货上门','团长加盟','商品推荐','余额充值',
				]
			}
		},
		onShow() {
			var user = uni.getStorageSync('user')
			if (user) {
				this.user = JSON.parse(user)
			} else {
				this.user = null
			}
			var current_team = uni.getStorageSync('current_team')
			if (current_team) {
				this.current_team = JSON.parse(current_team)
			}
		},
		methods: {
			toOrders(type, status) {
				if (this.user) {
					uni.navigateTo({
						url: '../../orders/orders?type=' + type + '&status=' + status
					})
				} else {
					console.log(1111)
					this.modalShow = true
				}
			},
			toLogin(e) {
				this.modalShow = false
				// 用户信息
				console.log(1, e);
				uni.login({
					success: (res) => {
						console.log(2, res)
						uni.request({
							url: this.apiUrl + "/client/user/login",
							method: "POST",
							header: {
								'content-type': 'application/x-www-form-urlencoded'
							},
							data: {
								code: res.code,
								encryptedData: e.detail.encryptedData,
								iv: e.detail.iv,
								rawData: e.detail.rawData,
								signature: e.detail.signature
							},
							success: (res) => {
								const result = res.data;
								console.log(result)
								if (result.code === 200) {
									this.user = result.data
									uni.setStorageSync('user', JSON.stringify(result.data));
									this.onshow()
								} else {
									uni.showToast({
										title: result.msg,
										icon: "none"
									});
								}
							},
							fail: (res) => {
								uni.showToast({
									title: res.errMsg,
									icon: "none"
								});
							}
						})
					},
					fail: (err) => {
						console.log(3, err)
					}
				})
			},
			call(){
				uni.makePhoneCall({
					phoneNumber:this.current_team.mobile
				})
			},
			toService(i){
				uni.showToast({
					title: '敬请期待',
					icon: 'none'
				});
			}
		}
	}
</script>

<style>

</style>
